import { Component } from "react";
import WithRouter from "../../router/withRouter";
import sendHttp from "../../utils/http";
import './index.css'
class Info  extends Component {
        state = {
            bgUrl:"",
            spells:[]
        }
        render() {
            return (
                <div>
                  <div>
                    <img src={this.state.bgUrl} alt="" className="bg" />
                  </div>
                  <div>
                    {
                       this.state.spells.map((item,index)=>{
                        return (
                            <div key={index}>
                                <img src={item.abilityIconPath} alt="" />
                                <p>{item.description}</p>
                            </div>
                        )
                       }) 
                    }
                  </div>
                </div>
            )
        }
       async componentDidMount(){
            let {heroId} =this.props.router.loaction.state
            let res = await sendHttp(`/images/lol/act/img/js/hero/${heroId}.js`,'get');
            console.log(res)
            this.setState({
                bgUrl:res.data.skins[0].mainImg,
                spells:res.data.spells
            })
        }
    }

export default WithRouter(Info);